<script setup lang="ts">
import { ref } from 'vue'
import { useLoadingBar } from 'naive-ui'

const loadingBar = useLoadingBar()
const isLoading = ref(false)

function startLoading() {
  isLoading.value = true
  loadingBar.start()
}

function finishLoading() {
  isLoading.value = false
  loadingBar.finish()
}
</script>

<template>
  <h1>RoleView</h1>
  <div>
    <button @click="startLoading">Start Loading</button>
    <button @click="finishLoading">Finish Loading</button>
  </div>
</template>

<style scoped></style>
